<template>
    <div>
        <!-- 头部刷新区域 -->
        <div class="setdiv">
            <span>退换货申请详情</span>
            <el-button class="refreshRight" plain icon="el-icon-refresh" @click="REfResh">刷新</el-button>
        </div>
        <!-- 卡片视图区域 -->
        <el-card class="box-card">
            <div slot="header" class="clearfix getColor">
                <span>退换货申请详情</span>
            </div>
            <!-- 订单表数据 -->
            <div class="Checkcontent">
                <el-form label-width="80px" :model="list[0]">
                    <el-form-item label="订单编号">
                        <el-input v-model="list[0].ordernum"></el-input>
                    </el-form-item>
                    <el-form-item label="申请状态">
                        <el-input v-model="list[0].type"></el-input>
                    </el-form-item>
                    <el-form-item label="申请时间">
                        <el-input v-model="list[0].subtime"></el-input>
                    </el-form-item>
                    <el-form-item label="用户账号">
                        <el-input v-model="list[0].phone"></el-input>
                    </el-form-item>
                </el-form>
            </div>
            <!-- 订单金额相关表 -->
            <div class="Checkcontent">
                <el-form label-width="80px" :model="Amount[0]">
                    <el-form-item label="订单金额">
                        <el-input v-model="Amount[0].money"></el-input>
                    </el-form-item>
                    <el-form-item label="退款方式">
                        <el-input></el-input>
                    </el-form-item>
                    <el-form-item label="售后类型">
                        <el-input v-model="Amount[0].reasontype"></el-input>
                    </el-form-item>
                    <el-form-item label="申请原因">
                        <el-input v-model="Amount[0].describe"></el-input>
                    </el-form-item>
                    <el-form-item label="处理意见">
                        <el-input></el-input>
                    </el-form-item>
                </el-form>
            </div>
            <!-- 处理人信息框 -->
            <div class="Checkcontent">
                <el-form label-width="80px" :model="editdata">
                    <el-form-item label="处理人" prop="name">
                        <el-input v-model="editdata.name" disabled></el-input>
                    </el-form-item>
                    <el-form-item label="处理备注">
                        <el-input></el-input>
                    </el-form-item>
                    <el-form-item label="处理时间">
                        <el-input type="datetime-local"></el-input>
                    </el-form-item>
                </el-form>
            </div>
            <div class="Checkcontent1">
                <el-button type="primary" @click="addReturn">确认退货</el-button>
                <el-button type="info" @click="CancleReturn">取消退货</el-button>
            </div>
        </el-card>
    </div>
</template> 
 <script>
import date from "../../components/package";
export default {
    data() {
        return {
            // 存储关于订单方面的数据
            list: [{ ordernum: "" }],
            // 存储订单金额
            Amount: [{}],
            // 登录者的信息
            editdata: {
                name: "",
            },
        };
    },
    created() {
        // 初始化关于订单方面的数据
        this.getuserList();
        // 初始化订单金额相关数据
        this.getorderAmount();
        //获取登录时的数据
        let data = JSON.parse(sessionStorage.getItem("store")).usermsg;
        this.editdata = data;
    },
    methods: {
        // 刷新
        REfResh() {
            this.$message({
                message: "已刷新",
                type: "success",
            });
            // 初始化关于订单方面的数据
            this.getuserList();
            // 初始化订单金额相关数据
            this.getorderAmount();
        },
        //确认退货按钮
        addReturn() {
            alert("确认退货");
        },
        CancleReturn() {
            // this.$router.push("/homeframe/order/list");
            alert("取消退货");
        },
        // 获取关于订单方面的数据
        getuserList() {
            this.$axios({
                url: "/ordersreturn/getreturns",
            }).then((res) => {
                console.log(res);
                res.data.data.filter((v) => {
                    if (v.subtime) {
                        v.subtime = date.dateFn(v.subtime);
                    }
                    if (v.handletime) {
                        v.handletime = date.dateFn(v.handletime);
                    }
                });
                this.list = res.data.data;
            });
        },
        // 获取金额方面的数据
        getorderAmount() {
            this.$axios({
                url: "/ordersreturn/orderAmount",
            }).then((res) => {
                console.log(res);
                this.Amount = res.data.data;
            });
        },
        // 登录时角色的信息
    },
};
</script> 
<style lang="less" scoped>
.setdiv {
    background-color: #f2f2f2;
    padding: 17.5px 0;
    position: relative;
}
.setdiv > span {
    margin-left: 20px;
}
.refreshRight {
    position: absolute;
    right: 20px;
    top: 8px;
}
.el-card {
    margin-top: 20px;
}
.set {
    background-color: #f2f2f2;
    padding: 0;
}
.el-card > .set {
    padding: 0;
}
.clearfix > span {
    padding: 0 !important;
}
.el-card /deep/ .el-card__header {
    background-color: #f2f2f2;
}
.anniu {
    margin-left: 47.5%;
    width: 5%;
}
.el-form {
    width: 32%;
    margin-left: 34%;
}
// 设置表格边框
.Checkcontent {
    border: 1px solid black;
    margin-top: 2%;
    padding: 2%;
}
.Checkcontent1 {
    text-align: center;
    margin-top: 2%;
    padding: 2%;
}
</style> 

